.rzd-root{--rzd-border-color:#d1d5db;--rzd-border-color-active:#3b82f6;--rzd-border-width:2px;--rzd-border-radius:8px;--rzd-padding:24px;--rzd-bg:transparent;--rzd-bg-active:#3b82f60f;--rzd-overlay-bg:#3b82f626;--rzd-overlay-text-color:#1e3a8a;--rzd-text-color:#6b7280;--rzd-text-size:14px;--rzd-tile-size:96px;--rzd-tile-radius:6px;--rzd-tile-bg:#f3f4f6;--rzd-tile-border:#e5e7eb;--rzd-gap:12px;--rzd-remove-bg:#0009;--rzd-remove-color:#fff;--rzd-upload-overlay-bg:#00000080;--rzd-upload-overlay-color:#fff;--rzd-upload-progress-track:#ffffff40;--rzd-upload-progress-fill:#3b82f6;--rzd-upload-error-color:#ef4444;--rzd-upload-success-color:#10b981;min-height:120px;padding:var(--rzd-padding);border:var(--rzd-border-width) dashed var(--rzd-border-color);border-radius:var(--rzd-border-radius);background:var(--rzd-bg);color:var(--rzd-text-color);font-size:var(--rzd-text-size);cursor:pointer;box-sizing:border-box;outline:0;flex-direction:column;justify-content:center;transition:border-color .15s,background-color .15s;display:flex;position:relative}.rzd-root:focus-visible{border-color:var(--rzd-border-color-active)}.rzd-root--drag-over{border-color:var(--rzd-border-color-active);background:var(--rzd-bg-active)}.rzd-root--disabled{opacity:.6;cursor:not-allowed}.rzd-input{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.rzd-placeholder{text-align:center;-webkit-user-select:none;user-select:none}.rzd-tiles{gap:var(--rzd-gap);cursor:inherit;flex-wrap:wrap;display:flex}.rzd-tile{width:var(--rzd-tile-size);height:var(--rzd-tile-size);border-radius:var(--rzd-tile-radius);background:var(--rzd-tile-bg);border:1px solid var(--rzd-tile-border);box-sizing:border-box;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.rzd-tile--clickable{cursor:pointer}.rzd-tile--clickable:focus-visible{outline:2px solid var(--rzd-border-color-active);outline-offset:2px}.rzd-tile__image{object-fit:cover;width:100%;height:100%;display:block}.rzd-tile__placeholder{text-align:center;box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;gap:4px;width:100%;height:100%;padding:8px;display:flex}.rzd-tile__icon{width:32px;height:32px;color:var(--rzd-text-color);flex-shrink:0}.rzd-tile__name{word-break:break-word;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;font-size:11px;line-height:1.2;display:-webkit-box;overflow:hidden}.rzd-tile__remove{background:var(--rzd-remove-bg);width:20px;height:20px;color:var(--rzd-remove-color);cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:16px;line-height:1;display:flex;position:absolute;top:4px;right:4px}.rzd-tile__remove:hover{opacity:.85}.rzd-tile__upload-dim{background:var(--rzd-upload-overlay-bg);pointer-events:none;position:absolute;inset:0}.rzd-tile__upload-progress{background:var(--rzd-upload-progress-track);pointer-events:none;height:5px;position:absolute;bottom:0;left:0;right:0;overflow:hidden}.rzd-tile__upload-progress:before{content:"";pointer-events:none;background:linear-gradient(90deg,#0000 0,#ffffff80 50%,#0000 100%);animation:1.2s linear infinite rzd-upload-shimmer;position:absolute;inset:0}.rzd-tile__upload-progress-bar{background:var(--rzd-upload-progress-fill);width:0%;height:100%;transition:width .15s;position:relative}@keyframes rzd-upload-shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.rzd-tile__upload-error{box-sizing:border-box;pointer-events:none;background:#0000008c;flex-direction:column;justify-content:center;align-items:center;gap:6px;padding:8px;display:flex;position:absolute;inset:0}.rzd-tile__upload-error>*{pointer-events:auto}.rzd-tile__upload-error-text{color:var(--rzd-upload-error-color);text-align:center;word-break:break-word;background:#000000a6;border-radius:4px;max-width:100%;padding:4px 6px;font-size:11px;line-height:1.25}.rzd-tile__upload-action{background:var(--rzd-upload-progress-fill);color:#fff;cursor:pointer;border:none;border-radius:12px;justify-content:center;align-items:center;min-width:24px;height:24px;padding:0 8px;font-size:14px;line-height:1;display:inline-flex}.rzd-tile__upload-action:hover{opacity:.85}.rzd-tile--upload-error .rzd-tile__remove,.rzd-tile--uploading .rzd-tile__remove{z-index:2}.rzd-tile--upload-success:after{content:"";background:var(--rzd-upload-success-color);pointer-events:none;border-radius:50%;width:8px;height:8px;position:absolute;top:4px;left:4px;box-shadow:0 0 0 2px #fff}.rzd-overlay{background:var(--rzd-overlay-bg);color:var(--rzd-overlay-text-color);pointer-events:none;border-radius:var(--rzd-border-radius);justify-content:center;align-items:center;font-weight:500;display:flex;position:absolute;inset:0}.rzd-overlay__text{-webkit-user-select:none;user-select:none}.rzd-lightbox{background:var(--rzd-lightbox-bg,#000000d9);z-index:2147483646;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.rzd-lightbox__img{object-fit:contain;-webkit-user-select:none;user-select:none;max-width:90vw;max-height:90vh}.rzd-lightbox__btn{background:var(--rzd-lightbox-btn-bg,#ffffff1a);width:44px;height:44px;color:var(--rzd-lightbox-btn-color,#fff);cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;font-size:28px;line-height:1;display:flex;position:absolute}.rzd-lightbox__btn:hover{background:#fff3}.rzd-lightbox__btn--close{top:24px;right:24px}.rzd-lightbox__btn--prev{top:50%;left:24px;transform:translateY(-50%)}.rzd-lightbox__btn--next{top:50%;right:24px;transform:translateY(-50%)}.rzd-lightbox__counter{color:#fff;background:#0006;border-radius:12px;padding:4px 10px;font-size:13px;position:absolute;bottom:24px;left:50%;transform:translate(-50%)}body{color:#111;background:#fafafa;margin:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,sans-serif}.page{max-width:760px;margin:0 auto;padding:32px 24px 80px}h1{margin-bottom:8px}h2{border-top:1px solid #e5e7eb;margin:40px 0 12px;padding-top:24px;font-size:20px}h3{margin:24px 0 6px;font-size:15px}.example{margin-bottom:24px}.example__hint{color:#6b7280;margin:0 0 10px;font-size:13px}.example__code{color:#e2e8f0;white-space:pre;background:#0f172a;border-radius:6px;margin-top:10px;padding:12px 14px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;line-height:1.5;overflow-x:auto}.warn{color:#9a3412;background:#fff7ed;border:1px solid #fdba74;border-radius:6px;margin:12px 0 0;padding:10px 12px;font-size:13px}.warn code{background:#0000000f;border-radius:3px;padding:1px 4px}.controls{background:#fff;border:1px solid #e5e7eb;border-radius:6px;flex-wrap:wrap;gap:10px 18px;margin-bottom:12px;padding:12px 14px;font-size:13px;display:flex}.controls label{-webkit-user-select:none;user-select:none;align-items:center;gap:6px;display:inline-flex}.controls button{font:inherit;color:#3730a3;cursor:pointer;background:#eef2ff;border:1px solid #cbd5f5;border-radius:4px;padding:4px 10px}.controls button:hover{background:#e0e7ff}.controls button:disabled{opacity:.5;cursor:not-allowed}.status{color:#6b7280;margin-top:6px;font-size:12px}
/*# sourceMappingURL=playground.ae9dd180.css.map */