.dropzone{position:relative;border-radius:1rem;text-align:center;background-color:rgba(var(--color-rgb),.1);border:1.5px dashed var(--border);padding:1rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.75rem;outline:2px solid transparent;outline-offset:0}.dropzone:not(.has-file):hover,.dropzone:not(.has-file):focus-within,.dropzone:not(.has-file).drag-over{outline-color:rgba(var(--color-rgb),.75);outline-offset:2px}.dropzone.drag-over{border-style:solid}.dropzone input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%;z-index:2}.dropzone p{margin:0}.dropzone.is-reordering input[type=file]{pointer-events:none}.dropzone .dropzone-prompt{display:flex;flex-direction:column;align-items:center;gap:.5rem}.has-file :is(.dropzone .dropzone-prompt){display:none}.dropzone .dropzone-prompt .material-symbols-rounded{font-size:3rem}.dropzone .dropzone-prompt .dropzone-title{font-size:.875rem;font-weight:calc(var(--font-weight) + 200);font-family:var(--title-font)}.dropzone .dropzone-prompt .dropzone-subtext{font-size:.75rem;opacity:.75}.dropzone .file-preview{position:relative;width:100%;z-index:3}.dropzone .file-preview .file-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.5rem;width:100%}.dropzone .file-preview .file-item{display:flex;align-items:center;gap:.75rem;background:var(--card-bg);border:1px solid var(--border);border-radius:.5rem;padding:.5rem .75rem;text-align:left}.dropzone .file-preview .file-item.dragging{opacity:.4}.dropzone .file-preview .file-item .drag-handle{cursor:grab;color:var(--secondary);font-size:1.25rem}.dropzone .file-preview .file-item .drag-handle:active{cursor:grabbing}.dropzone .file-preview .file-item .preview-thumb{width:2.25rem;height:2.25rem;border-radius:.375rem;object-fit:cover;background:var(--border-half);flex-shrink:0;display:flex;align-items:center;justify-content:center}.dropzone .file-preview .file-item .file-details{flex:1;min-width:0}.dropzone .file-preview .file-item .file-details .file-name{font-size:.875rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0}.dropzone .file-preview .file-item .file-details .file-size{font-size:.625rem;opacity:.75;margin-top:.1rem;font-family:var(--mono-font)}.dropzone .file-preview .file-item .remove-btn{position:relative;z-index:10;cursor:pointer}.input-colour-picker-group{display:inline-flex;flex-direction:column;gap:.5em;font-family:var(--normal-font)}.input-colour-picker-group .input-colour-picker-controls{display:flex;align-items:center;gap:.5em}.input-colour-picker-group .input-colour-swatch-wrapper{position:relative;width:2.5em;height:2.5em;border-radius:1em;border:1px solid var(--border);overflow:hidden;box-shadow:0 1px 2px #0000000d;flex-shrink:0;padding:0}.input-colour-picker-group .native-colour-input{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;cursor:pointer;z-index:2}.input-colour-picker-group .input-colour-swatch-preview{display:block;width:100%;height:100%}.input-colour-picker-group .input-colour-hex-input-wrapper{display:flex;align-items:center;height:2.5em;width:100%;font-family:var(--mono-font);position:relative}.input-colour-picker-group .input-colour-hex-prefix{position:absolute;-webkit-user-select:none;user-select:none;color:rgba(var(--color-rgb),.5);left:1em}.input-colour-picker-group .input-colour-hex-input{width:100%;padding-left:1.5em;text-transform:uppercase;font-family:inherit}.input-colour-picker-group .input-colour-hex-input[aria-invalid=true]{color:var(--danger)}.input-colour-picker-group .input-colour-hex-input[aria-invalid=true]~.input-colour-error-message{display:block}.input-colour-picker-group .input-colour-error-message{position:absolute;right:.5em;color:var(--danger);display:none}