@keyframes marching-ants{0%{background-position:0 0,0 100%,0 0,100% 0}to{background-position:20px 0,-20px 100%,0 -20px,100% 20px}}:root{--rc-drag-handle-size: 12px;--rc-drag-handle-mobile-size: 24px;--rc-drag-handle-bg-colour: rgba(0, 0, 0, .2);--rc-drag-bar-size: 6px;--rc-border-color: rgba(255, 255, 255, .7);--rc-focus-color: #0088ff}.ReactCrop{position:relative;display:inline-block;cursor:crosshair;max-width:100%}.ReactCrop *,.ReactCrop *:before,.ReactCrop *:after{box-sizing:border-box}.ReactCrop--disabled,.ReactCrop--locked{cursor:inherit}.ReactCrop__child-wrapper{overflow:hidden;max-height:inherit}.ReactCrop__child-wrapper>img,.ReactCrop__child-wrapper>video{display:block;max-width:100%;max-height:inherit}.ReactCrop:not(.ReactCrop--disabled) .ReactCrop__child-wrapper>img,.ReactCrop:not(.ReactCrop--disabled) .ReactCrop__child-wrapper>video{touch-action:none}.ReactCrop:not(.ReactCrop--disabled) .ReactCrop__crop-selection{touch-action:none}.ReactCrop__crop-mask{position:absolute;inset:0;pointer-events:none;width:calc(100% + .5px);height:calc(100% + .5px)}.ReactCrop__crop-selection{position:absolute;top:0;left:0;transform:translateZ(0);cursor:move}.ReactCrop--disabled .ReactCrop__crop-selection{cursor:inherit}.ReactCrop--circular-crop .ReactCrop__crop-selection{border-radius:50%}.ReactCrop--circular-crop .ReactCrop__crop-selection:after{pointer-events:none;content:"";position:absolute;inset:-1px;border:1px solid var(--rc-border-color);opacity:.3}.ReactCrop--no-animate .ReactCrop__crop-selection{outline:1px dashed white}.ReactCrop__crop-selection:not(.ReactCrop--no-animate .ReactCrop__crop-selection){animation:marching-ants 1s;background-image:linear-gradient(to right,#fff 50%,#444 50%),linear-gradient(to right,#fff 50%,#444 50%),linear-gradient(to bottom,#fff 50%,#444 50%),linear-gradient(to bottom,#fff 50%,#444 50%);background-size:10px 1px,10px 1px,1px 10px,1px 10px;background-position:0 0,0 100%,0 0,100% 0;background-repeat:repeat-x,repeat-x,repeat-y,repeat-y;color:#fff;animation-play-state:running;animation-timing-function:linear;animation-iteration-count:infinite}.ReactCrop__crop-selection:focus{outline:2px solid var(--rc-focus-color);outline-offset:-1px}.ReactCrop--invisible-crop .ReactCrop__crop-mask,.ReactCrop--invisible-crop .ReactCrop__crop-selection{display:none}.ReactCrop__rule-of-thirds-vt:before,.ReactCrop__rule-of-thirds-vt:after,.ReactCrop__rule-of-thirds-hz:before,.ReactCrop__rule-of-thirds-hz:after{content:"";display:block;position:absolute;background-color:#fff6}.ReactCrop__rule-of-thirds-vt:before,.ReactCrop__rule-of-thirds-vt:after{width:1px;height:100%}.ReactCrop__rule-of-thirds-vt:before{left:33.3333333333%}.ReactCrop__rule-of-thirds-vt:after{left:66.6666666667%}.ReactCrop__rule-of-thirds-hz:before,.ReactCrop__rule-of-thirds-hz:after{width:100%;height:1px}.ReactCrop__rule-of-thirds-hz:before{top:33.3333333333%}.ReactCrop__rule-of-thirds-hz:after{top:66.6666666667%}.ReactCrop__drag-handle{position:absolute;width:var(--rc-drag-handle-size);height:var(--rc-drag-handle-size);background-color:var(--rc-drag-handle-bg-colour);border:1px solid var(--rc-border-color)}.ReactCrop__drag-handle:focus{background:var(--rc-focus-color)}.ReactCrop .ord-nw{top:0;left:0;transform:translate(-50%,-50%);cursor:nw-resize}.ReactCrop .ord-n{top:0;left:50%;transform:translate(-50%,-50%);cursor:n-resize}.ReactCrop .ord-ne{top:0;right:0;transform:translate(50%,-50%);cursor:ne-resize}.ReactCrop .ord-e{top:50%;right:0;transform:translate(50%,-50%);cursor:e-resize}.ReactCrop .ord-se{bottom:0;right:0;transform:translate(50%,50%);cursor:se-resize}.ReactCrop .ord-s{bottom:0;left:50%;transform:translate(-50%,50%);cursor:s-resize}.ReactCrop .ord-sw{bottom:0;left:0;transform:translate(-50%,50%);cursor:sw-resize}.ReactCrop .ord-w{top:50%;left:0;transform:translate(-50%,-50%);cursor:w-resize}.ReactCrop__disabled .ReactCrop__drag-handle{cursor:inherit}.ReactCrop__drag-bar{position:absolute}.ReactCrop__drag-bar.ord-n{top:0;left:0;width:100%;height:var(--rc-drag-bar-size);transform:translateY(-50%)}.ReactCrop__drag-bar.ord-e{right:0;top:0;width:var(--rc-drag-bar-size);height:100%;transform:translate(50%)}.ReactCrop__drag-bar.ord-s{bottom:0;left:0;width:100%;height:var(--rc-drag-bar-size);transform:translateY(50%)}.ReactCrop__drag-bar.ord-w{top:0;left:0;width:var(--rc-drag-bar-size);height:100%;transform:translate(-50%)}.ReactCrop--new-crop .ReactCrop__drag-bar,.ReactCrop--new-crop .ReactCrop__drag-handle,.ReactCrop--fixed-aspect .ReactCrop__drag-bar,.ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-n,.ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-e,.ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-s,.ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-w{display:none}@media(pointer:coarse){.ReactCrop .ord-n,.ReactCrop .ord-e,.ReactCrop .ord-s,.ReactCrop .ord-w{display:none}.ReactCrop__drag-handle{width:var(--rc-drag-handle-mobile-size);height:var(--rc-drag-handle-mobile-size)}}.image-upload{width:100%}.dropzone{border:3px dashed #475569;border-radius:12px;padding:3rem 2rem;text-align:center;cursor:pointer;transition:all .3s ease;background:#0f172a66}.dropzone:hover{border-color:#3b82f6;background:#3b82f60d}.dropzone.active{border-color:#22c55e;background:#22c55e1a;transform:scale(1.02)}.dropzone-content .icon{font-size:4rem;margin:0 0 1rem}.dropzone-content .main-text{font-size:1.2rem;font-weight:600;color:#cbd5e1;margin:0 0 .5rem}.dropzone-content .sub-text{font-size:1rem;color:#94a3b8;margin:0 0 1rem}.dropzone-content .info{font-size:.85rem;color:#64748b;margin:0}.error-message{margin-top:1rem;padding:.75rem 1rem;background:#ef44441a;border:1px solid #ef4444;border-radius:8px;color:#fca5a5;text-align:center}.image-preview{display:flex;flex-direction:column;gap:1rem;align-items:center}.image-preview img{max-width:100%;max-height:400px;border-radius:8px;border:2px solid #475569}.preview-actions{display:flex;gap:.75rem;justify-content:center}.crop-container{display:flex;flex-direction:column;gap:1.5rem}.crop-container h4{margin:0;font-size:1.1rem;color:#f1f5f9;text-align:center}.crop-area{display:flex;justify-content:center;max-height:500px;overflow:auto;background:#0000004d;border-radius:8px;padding:1rem}.crop-area img{max-width:100%;display:block}.crop-actions{display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap}.btn{padding:.625rem 1.25rem;font-size:.95rem;font-weight:500;border:none;border-radius:6px;cursor:pointer;transition:all .3s ease}.btn-primary{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 12px #3b82f64d}@media(max-width:768px){.dropzone{padding:2rem 1rem}.dropzone-content .icon{font-size:3rem}.preview-actions,.crop-actions{flex-direction:column}.btn{width:100%}}:global(.ReactCrop){max-width:100%}:global(.ReactCrop__crop-selection){border:2px solid #3b82f6}.ai-image-generator{width:100%;display:flex;flex-direction:column;gap:1.5rem}.prompt-section{display:flex;flex-direction:column;gap:.75rem}.prompt-section label{font-size:1rem;font-weight:500;color:#cbd5e1}.prompt-section textarea{padding:.875rem;font-size:.95rem;background:#0f172acc;border:2px solid #475569;border-radius:8px;color:#f1f5f9;font-family:inherit;resize:vertical;transition:all .3s ease}.prompt-section textarea:focus{outline:none;border-color:#fbbf24;box-shadow:0 0 0 3px #fbbf241a}.prompt-section textarea:disabled{opacity:.6;cursor:not-allowed}.hint{font-size:.85rem;color:#94a3b8;margin:0}.templates-section h4{font-size:.95rem;color:#cbd5e1;margin:0 0 .75rem}.templates-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.75rem}.template-btn{padding:.75rem;font-size:.9rem;font-weight:500;background:#3b82f61a;border:2px solid #3b82f6;color:#60a5fa;border-radius:6px;cursor:pointer;transition:all .3s ease}.template-btn:hover:not(:disabled){background:#3b82f633;transform:translateY(-2px)}.template-btn:disabled{opacity:.5;cursor:not-allowed}.generate-btn{width:100%;padding:1rem;font-size:1.05rem;display:flex;align-items:center;justify-content:center;gap:.5rem}.spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}.info-box{background:#3b82f61a;border:1px solid #3b82f6;border-radius:8px;padding:1rem;font-size:.9rem;color:#cbd5e1}.info-box strong{color:#60a5fa}.info-box ul{margin:.5rem 0 0;padding-left:1.5rem}.info-box li{margin-bottom:.25rem}.result-section{display:flex;flex-direction:column;gap:1.5rem}.result-section h4{margin:0;font-size:1.1rem;color:#f1f5f9;text-align:center}.generated-image{display:flex;justify-content:center;padding:1rem;background:#0000004d;border-radius:8px}.generated-image img{max-width:100%;max-height:400px;border-radius:8px;border:2px solid #475569}.result-actions{display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap}.regenerate-hint{text-align:center;font-size:.85rem;color:#94a3b8;margin:0}.status-message{padding:.875rem 1rem;background:#3b82f61a;border:1px solid #3b82f6;border-radius:8px;color:#93c5fd;text-align:center;animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.error-message{padding:.875rem 1rem;background:#ef44441a;border:1px solid #ef4444;border-radius:8px;color:#fca5a5;text-align:center}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#1e293b}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 12px #fbbf244d}.btn-secondary:hover:not(:disabled){background:#94a3b84d;border-color:#64748b}.btn-danger:hover:not(:disabled){background:#ef44444d;border-color:#dc2626}@media(max-width:768px){.templates-grid{grid-template-columns:1fr 1fr}.result-actions{flex-direction:column}.btn{width:100%}}.drawing-canvas{width:100%;display:flex;flex-direction:column;gap:1.5rem}.canvas-toolbar{background:#1e293b99;border:1px solid rgba(148,163,184,.2);border-radius:8px;padding:1rem;display:flex;flex-direction:column;gap:1rem}.tool-group{display:flex;flex-direction:column;gap:.5rem}.tool-group label{font-size:.9rem;font-weight:500;color:#cbd5e1}.tool-buttons{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.tool-btn{padding:.625rem;font-size:.9rem;background:#0f172acc;border:2px solid #475569;color:#cbd5e1;border-radius:6px;cursor:pointer;transition:all .3s ease}.tool-btn:hover{border-color:#3b82f6}.tool-btn.active{border-color:#3b82f6;background:#3b82f633;color:#60a5fa}input[type=range]{width:100%;height:6px;background:#94a3b84d;border-radius:3px;outline:none;-webkit-appearance:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;background:#3b82f6;border-radius:50%;cursor:pointer}input[type=range]::-moz-range-thumb{width:18px;height:18px;background:#3b82f6;border-radius:50%;cursor:pointer;border:none}.color-picker{display:flex;align-items:center;gap:.75rem}.color-picker input[type=color]{width:50px;height:40px;border:2px solid #475569;border-radius:6px;cursor:pointer;background:none}.color-picker span{font-family:monospace;font-size:.85rem;color:#94a3b8;text-transform:uppercase}.canvas-container{display:flex;justify-content:center;padding:1rem;background:#0f172a99;border:2px solid #475569;border-radius:8px;overflow:auto}.canvas-container canvas{border:2px solid #94a3b8;border-radius:4px;box-shadow:0 4px 12px #0000004d;cursor:crosshair}.canvas-actions{display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap}.btn{padding:.75rem 1.5rem;font-size:.95rem;font-weight:500;border:none;border-radius:6px;cursor:pointer;transition:all .3s ease}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 12px #22c55e4d}.btn-danger{background:#ef444433;border:2px solid #ef4444;color:#fca5a5}.btn-danger:hover{background:#ef44444d;border-color:#dc2626}.canvas-tips{background:#3b82f61a;border:1px solid #3b82f6;border-radius:8px;padding:1rem;font-size:.9rem;color:#cbd5e1}.canvas-tips strong{color:#60a5fa}.canvas-tips ul{margin:.5rem 0 0;padding-left:1.5rem}.canvas-tips li{margin-bottom:.25rem}@media(max-width:768px){.canvas-container{overflow-x:auto}.canvas-container canvas{max-width:100%}.tool-buttons{grid-template-columns:1fr}.canvas-actions{flex-direction:column}.btn{width:100%}}.card-editor{width:100%;max-width:800px;margin:0 auto}.card-editor form{display:flex;flex-direction:column;gap:2rem}.editor-section{background:#1e293b99;border:1px solid rgba(148,163,184,.2);border-radius:12px;padding:1.5rem}.editor-section h3{margin:0 0 1.5rem;font-size:1.3rem;color:#f1f5f9;border-bottom:2px solid #3b82f6;padding-bottom:.5rem}.card-type-selector{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.type-btn{padding:1rem;font-size:1rem;font-weight:600;border:2px solid #475569;background:#0f172acc;color:#cbd5e1;border-radius:8px;cursor:pointer;transition:all .3s ease}.type-btn:hover{border-color:#3b82f6;background:#3b82f61a}.type-btn.active{border-color:#3b82f6;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;box-shadow:0 4px 12px #3b82f64d}.form-group{display:flex;flex-direction:column;gap:.5rem;position:relative}.form-group label{font-size:.95rem;font-weight:500;color:#cbd5e1}.form-group input,.form-group select,.form-group textarea{padding:.75rem;font-size:1rem;background:#0f172acc;border:2px solid #475569;border-radius:8px;color:#f1f5f9;transition:all .3s ease}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.form-group textarea{resize:vertical;font-family:inherit}.char-count{position:absolute;bottom:-1.5rem;right:0;font-size:.75rem;color:#94a3b8}.form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-bottom:1rem}.image-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-bottom:1.5rem}.tab-btn{padding:.75rem;font-size:.95rem;font-weight:500;border:2px solid #475569;background:#0f172acc;color:#cbd5e1;border-radius:6px;cursor:pointer;transition:all .3s ease}.tab-btn:hover{border-color:#fbbf24;background:#fbbf241a}.tab-btn.active{border-color:#fbbf24;background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#1e293b;font-weight:600}.image-content{min-height:200px;display:flex;align-items:center;justify-content:center}.upload-placeholder,.canvas-placeholder,.ai-placeholder{width:100%;padding:3rem;text-align:center;background:#0f172a99;border:2px dashed #475569;border-radius:8px;color:#94a3b8}.editor-actions{display:flex;gap:1rem;justify-content:center;padding:1rem 0}.btn{padding:.875rem 2rem;font-size:1rem;font-weight:600;border:none;border-radius:8px;cursor:pointer;transition:all .3s ease}.btn-primary{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 16px #22c55e4d}.btn-secondary{background:#94a3b833;border:2px solid #475569;color:#cbd5e1}.btn-secondary:hover{background:#94a3b84d;border-color:#64748b}@media(max-width:768px){.card-type-selector,.form-row,.image-tabs{grid-template-columns:1fr}.editor-actions{flex-direction:column}.btn{width:100%}}.preview-empty{min-height:400px;display:flex;align-items:center;justify-content:center;color:#94a3b8;text-align:center;padding:2rem}.card-container{--width: 350px;--height: calc(var(--width) * 1.45);--border-size: calc(var(--width) / 19.5);--bg-texture: url(/bg-texture.jpeg), linear-gradient(#141414, #141414)}.card-container{width:var(--width);height:var(--height);background-image:var(--bg-texture);background-blend-mode:overlay,normal;background-clip:padding-box,border-box;border:var(--border-size) solid transparent;border-bottom-width:calc(var(--border-size) * 1.6);padding:var(--border-size);position:relative;display:inline-flex;flex-direction:column;margin:0 auto}.card-container:before{content:"";border:1px solid var(--color);display:block;position:absolute;width:calc(100% + var(--border-size));height:calc(100% + calc(var(--border-size) * 1.25));transform:translate(calc(var(--border-size) * -1.5),calc(var(--border-size) * -1.5));clip-path:polygon(0 0,100% 0,100% 100%,80% 100%,80% 90%,20% 90%,100% 100%,0 100%)}.image-container,.description-container{width:88%;height:auto;margin:0 auto;background:linear-gradient(#010011,#010011) padding-box,var(--category-gradient) border-box;padding:3px;border:3px solid transparent;display:grid;place-items:center;user-select:none}.card-container img{width:100%}.image-container{margin-top:55px;flex:1}.image-container img{width:100%;height:100%;min-height:220px;max-height:280px;object-fit:cover}.placeholder-image{width:100%;height:220px;display:flex;align-items:center;justify-content:center;color:#666;background:#1a1a1a;font-size:14px}.description-container{position:relative;background:linear-gradient(#341d14,#1a0f0a) padding-box,var(--category-gradient) border-box;min-height:70px;max-height:90px;overflow-y:auto;margin-top:auto}.description-container p{font-size:11px;color:#ccc;padding:.5rem;margin:0;line-height:1.4}.card-container header{--gradient: linear-gradient(to right, var(--color), var(--color) 100%);display:grid;place-items:center;width:90%;padding:.2rem .5rem;background:var(--gradient);box-sizing:border-box;transform:translateY(.4rem);position:absolute;z-index:2;top:1%}.card-container header .text{display:grid;grid-template-columns:3fr 1fr;width:calc(100% - 4px);height:calc(100% - 4px);padding:.2rem .5rem;background:#1d1d1d}.card-container header .text h1{margin:0;font-size:11px;color:var(--color);padding:.3rem .5rem .2rem;background:var(--color);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card-container header .text .icons{width:100%;height:100%;display:flex;justify-content:flex-end;align-items:center;background:transparent;gap:.3rem}.card-container header .text .icons .number{font-weight:800;font-size:1rem;color:#fff}.card-container header .text .icons img{height:24px;width:24px}.card-container header .text .statistics{color:#fff;display:flex;justify-content:flex-end;align-items:center;gap:.5rem}.card-container header .text .statistics .attack,.card-container header .text .statistics .defense{display:flex;align-items:center;gap:.15rem}.card-container header .text .statistics p{font-size:.75rem;margin:0;background:none;-webkit-text-fill-color:#fff}.card-container header.description{top:auto;bottom:22%}.card-container header.description .text{grid-template-columns:1fr 80px}.card-container header.description.spell-type .text,.card-container header.description.trap-type .text{grid-template-columns:1fr}.card-container header.description .text.single{grid-template-columns:1fr}.class-card{position:absolute;bottom:-24px;left:50%;transform:translate(-50%);width:fit-content;min-width:80px;text-align:center;color:var(--color);border:2px solid var(--color);padding:.2rem .4rem;border-radius:.4rem;background-color:#222;font-size:10px;font-weight:700;text-transform:uppercase}.description-container::-webkit-scrollbar{width:4px}.description-container::-webkit-scrollbar-track{background:#0003}.description-container::-webkit-scrollbar-thumb{background:var(--color);border-radius:2px}@media(max-width:600px){.card-container{--width: 300px}}.editor-wrapper{width:100%}.editor-wrapper-content{display:grid;grid-template-columns:1fr 500px;gap:2rem;align-items:start}.editor-side{width:100%}.preview-side{position:sticky;top:2rem;background:#1e293b99;border:1px solid rgba(148,163,184,.2);border-radius:12px;padding:1.5rem}.preview-side h2{margin:0 0 1.5rem;font-size:1.3rem;color:#f1f5f9;border-bottom:2px solid #fbbf24;padding-bottom:.5rem}.editor-wrapper-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px;gap:1rem}.spinner-large{width:50px;height:50px;border:4px solid rgba(251,191,36,.2);border-top-color:#fbbf24;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.editor-wrapper-error{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px;gap:1rem;text-align:center}.editor-wrapper-error p{color:#f87171;font-size:1.2rem}.save-notification{margin-top:1rem;padding:1rem;border-radius:8px;text-align:center;animation:slideIn .3s ease}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.save-notification.saving{background:#3b82f633;border:1px solid rgba(59,130,246,.5);color:#60a5fa}.save-notification.success{background:#22c55e33;border:1px solid rgba(34,197,94,.5);color:#4ade80}.save-notification.error{background:#ef444433;border:1px solid rgba(239,68,68,.5);color:#f87171}.btn{display:inline-block;padding:.75rem 1.5rem;border-radius:8px;font-weight:600;text-decoration:none;transition:all .3s ease;cursor:pointer;border:none}.btn-primary{background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#1a1a1a}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 4px 12px #fbbf2466}@media(max-width:1000px){.editor-wrapper-content{grid-template-columns:1fr}.preview-side{position:relative;top:0}}