.media-field{min-width:0}.media-field-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:10px}.media-field-heading>span{font-size:13px;font-weight:600}.media-field-heading small{color:var(--muted);font-size:11px}.media-field-body{display:flex;align-items:center;gap:18px;padding:14px;border:1px solid var(--line);border-radius:11px;background:var(--surface)}.media-field-preview{width:160px;flex:none;aspect-ratio:var(--media-ratio,1.7778);border-radius:7px;overflow:hidden;background:linear-gradient(135deg,#edf7fd,#e8f0fc);border:1px solid #dce9f4;display:grid;place-items:center}.media-field-preview img{width:100%;height:100%;object-fit:cover}.media-field-preview>span{display:flex;align-items:center;flex-direction:column;gap:9px;color:#7894ad;text-align:center;padding:10px}.media-field-preview>span svg{width:28px;height:28px;opacity:.7}.media-field-preview>span small{font-size:10px;line-height:1.6}.media-field-tools{min-width:0;flex:1}.media-field-buttons{display:flex;align-items:center;gap:5px;flex-wrap:wrap}.media-field-buttons button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;border-radius:7px;font-size:12px;padding:9px 11px;color:var(--blue)}.media-field-buttons button:hover{background:var(--blue-soft)}.media-field-buttons .media-upload-button{background:var(--blue-soft)}.media-field-buttons button svg{width:15px;height:15px}.media-field-buttons .media-remove-button{color:var(--muted)}.media-field-tools>p{font-size:11px;line-height:1.85;color:var(--muted);margin-top:9px}.media-field-tools>.media-field-error{color:#b05263}.media-file-input{position:absolute;left:0;top:0;width:1px;height:1px;clip-path:inset(50%);overflow:hidden;opacity:0;pointer-events:none}
.media-editor-dialog{width:min(760px,calc(100vw - 32px));max-height:calc(100dvh - 32px);padding:25px;border-radius:15px;overscroll-behavior:contain}.media-editor-dialog::backdrop{background:#13274796;backdrop-filter:blur(7px)}.media-editor-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:20px}.media-editor-head .eyebrow{font-size:10px;letter-spacing:.15em}.media-editor-head h2{font-size:22px;margin-top:8px;line-height:1.4}.media-editor-head p{font-size:12px;color:var(--muted);line-height:1.8;margin-top:9px}.media-editor-close{flex:none;font-size:29px;font-weight:300;margin:-5px -5px 0 0}.media-crop-stage{width:min(100%,calc(48dvh * var(--media-ratio,1.7778)));aspect-ratio:var(--media-ratio,1.7778);margin-inline:auto;position:relative;border-radius:9px;overflow:hidden;background-color:#dce9f1;background-image:linear-gradient(45deg,#ffffff40 25%,transparent 25%),linear-gradient(-45deg,#ffffff40 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#ffffff40 75%),linear-gradient(-45deg,transparent 75%,#ffffff40 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0;border:1px solid #cadeed}.media-crop-stage canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab;outline-offset:-4px}.media-crop-stage canvas.is-dragging{cursor:grabbing}.media-crop-grid{position:absolute;inset:0;pointer-events:none;border:1px solid #ffffff7a;background:linear-gradient(to right,transparent 33.2%,#ffffff55 33.2%,#ffffff55 33.4%,transparent 33.4%,transparent 66.5%,#ffffff55 66.5%,#ffffff55 66.7%,transparent 66.7%),linear-gradient(to bottom,transparent 33.2%,#ffffff55 33.2%,#ffffff55 33.4%,transparent 33.4%,transparent 66.5%,#ffffff55 66.5%,#ffffff55 66.7%,transparent 66.7%)}.media-crop-status{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:11px;color:#57738e;background:#edf5fa;font-size:13px;padding:22px;text-align:center}.media-crop-status>svg{width:25px;height:25px}.media-loading-dot{width:8px;height:8px;flex:none;border-radius:50%;background:#6999b8;animation:media-loading 1s ease-in-out infinite alternate}.media-crop-controls{display:flex;align-items:center;gap:15px;margin-top:18px;font-size:12px}.media-crop-controls label{flex:none;font-weight:550}.media-crop-controls input{flex:1;width:80px;min-width:0;accent-color:var(--blue);cursor:pointer}.media-crop-controls output{width:36px;font-variant-numeric:tabular-nums;color:var(--muted)}.media-reset-button{min-height:40px;padding:8px 12px;color:var(--blue);border:1px solid var(--line);border-radius:7px}.media-crop-accessibility{font-size:11px;line-height:1.8;color:var(--muted);margin-top:7px}.media-editor-feedback{background:#c96b7810;border:1px solid #d9a0a860;border-radius:7px;color:#b05263;padding:11px 14px;font-size:12px;line-height:1.8;margin-top:14px}.media-editor-footer{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}.media-editor-footer>div{display:flex;gap:10px}.media-editor-footer .button{min-height:44px;padding:11px 17px;font-size:13px}.media-editor-replace{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:var(--blue);padding:10px 0;min-height:44px;white-space:nowrap}.media-editor-replace svg{width:15px;height:15px}
@keyframes media-loading{from{opacity:.3}to{opacity:1}}
@media(max-width:600px){.media-field-body{align-items:stretch;gap:13px;padding:12px}.media-field-preview{width:100px;align-self:flex-start;margin-top:4px}.media-field-preview>span{gap:5px;padding:7px}.media-field-preview>span small{font-size:8px}.media-field-preview>span svg{width:23px;height:23px}.media-field-buttons{gap:2px}.media-field-buttons button{font-size:11px;min-height:38px;padding:8px}.media-field-buttons button svg{width:13px;height:13px}.media-field-tools>p{font-size:10px;line-height:1.8;margin-top:7px}.media-editor-dialog{width:calc(100vw - 20px);max-height:calc(100dvh - 20px);padding:20px 17px}.media-editor-head{margin-bottom:17px}.media-editor-head h2{font-size:20px}.media-editor-head p{font-size:11px}.media-crop-controls{gap:10px;margin-top:14px}.media-crop-accessibility{font-size:10px}.media-editor-footer{flex-wrap:wrap;gap:7px;margin-top:15px;padding-top:12px}.media-editor-footer>div{margin-left:auto}.media-editor-footer .button{padding:10px 13px;font-size:12px}.media-editor-replace{font-size:11px}.media-crop-status{font-size:12px}}
@media(prefers-reduced-motion:reduce){.media-loading-dot{animation:none}}:root[data-reduced-motion="true"] .media-loading-dot{animation:none}
.media-field-body{flex-wrap:wrap;align-items:flex-start}.media-field-preview{max-width:100%}.media-field-tools{flex:1 1 170px;min-width:min(100%,170px)}.media-field-buttons button{white-space:nowrap;flex-shrink:0}