@import "https://fonts.googleapis.com/css2?family=Lexend:wght@400;500;600;700&family=Roboto:wght@400;500;700&display=swap";:root{--bg-main:#131416;--bg-surface:#202124;--border-color:#3c4043;--border-glow:#8ab4f8;--color-primary:#8ab4f8;--color-success:#81c995;--color-danger:#f28b82;--color-warning:#fdd663;--color-text-primary:#e3e3e3;--color-text-secondary:#9aa0a6;--color-text-muted:#70757a;--font-title:"Lexend", sans-serif;--font-body:"Roboto", sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-main);color:var(--color-text-primary);font-family:var(--font-body);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;overflow-x:hidden}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg-main)}::-webkit-scrollbar-thumb{background:#3c4043;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#5f6368}.app-container{flex-direction:column;gap:2rem;max-width:1400px;margin:0 auto;padding:0 2rem 2rem;display:flex}.app-header{background:var(--bg-main);z-index:1000;border-bottom:1px solid var(--border-color);justify-content:space-between;align-items:center;padding-top:1.5rem;padding-bottom:1.5rem;display:flex;position:sticky;top:0;box-shadow:0 10px 30px -10px #00000080}.logo-section h1{font-family:var(--font-title);letter-spacing:-.01em;color:var(--color-text-primary);font-size:1.6rem;font-weight:500}.logo-section p{color:var(--color-text-secondary);margin-top:.25rem;font-size:.85rem}.grid-layout-top{grid-template-columns:1fr 2fr;align-items:stretch;gap:2rem;height:680px;display:grid}.catalog-section-bottom{border-top:1px solid var(--border-color);padding-top:2rem}.catalog-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.5rem;display:grid}.catalog-char-token{width:44px;height:44px;font-family:var(--font-title);text-shadow:0 1px 2px #0009;border:1px solid #0000;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;font-size:.85rem;font-weight:700;display:flex;box-shadow:0 2px 4px #0000004d}.catalog-char-token.rarity-commun{color:#e3e3e3;background:#303134;border-color:#3c4043}.catalog-char-token.rarity-rare{color:#8ab4f8;background:#8ab4f826;border-color:#8ab4f8}.catalog-char-token.rarity-epique{color:#c573e8;background:#c573e826;border-color:#c573e8}.catalog-char-token.rarity-legendaire{color:#fdd663;background:#fdd66326;border-color:#fdd663}.catalog-char-token.rarity-mythique{color:#ff80ab;background:linear-gradient(135deg,#ff80ab26,#8ab4f826,#c573e826) 0 0/200% 200%;border-color:#ff80ab;animation:3s linear infinite rainbow-bg}.catalog-char-token.rarity-secret{color:#fff;background:#000;border-color:#5f6368}.catalog-char-token.rarity-dieu{color:#f28b82;background:#f28b8226;border-color:#f28b82}.catalog-char-token.rarity-divin{color:#81c995;background:#81c99526;border-color:#81c995}.catalog-char-token.rarity-limite{color:#78e9fa;background:#78e9fa26;border-color:#78e9fa}@media (width<=1024px){.grid-layout-top{grid-template-columns:1fr;height:auto}}.panel-card{background:var(--bg-surface);border:1px solid var(--border-color);border-radius:8px;padding:1.5rem;transition:border-color .15s}.panel-card:hover{border-color:#5f6368}.panel-title{font-family:var(--font-title);color:var(--color-text-primary);border-bottom:1px solid #3c4043;margin-bottom:1.25rem;padding-bottom:.5rem;font-size:.95rem;font-weight:500}.btn{font-family:var(--font-title);cursor:pointer;border:1px solid #0000;border-radius:4px;justify-content:center;align-items:center;gap:.5rem;padding:.5rem 1.25rem;font-size:.875rem;font-weight:500;text-decoration:none;transition:background-color .15s,border-color .15s;display:inline-flex}.btn-primary{color:#202124;background:#8ab4f8;border-color:#8ab4f8}.btn-primary:hover:not(:disabled){background:#aecbfa;border-color:#aecbfa}.btn-primary:disabled{color:var(--color-text-secondary);opacity:.38;cursor:not-allowed;background:#3c4043;border-color:#3c4043}.btn-secondary{color:#8ab4f8;background:0 0;border-color:#3c4043}.btn-secondary:hover:not(:disabled){background:#8ab4f80a;border-color:#5f6368}.btn-danger{color:#f28b82;background:0 0;border-color:#3c4043}.btn-danger:hover:not(:disabled){background:#f28b820a;border-color:#fad2cf}.settings-row{grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1.5rem;display:grid}.form-group{flex-direction:column;gap:.5rem;display:flex}.form-group label{color:var(--color-text-secondary);font-size:.8rem;font-weight:500}.form-control{border:1px solid var(--border-color);color:var(--color-text-primary);font-family:var(--font-body);box-sizing:border-box;background:#202124;border-radius:4px;width:100%;padding:.5rem .75rem;font-size:.875rem;transition:border-color .15s}.form-control:focus{border-color:#8ab4f8;outline:none}.grid-view-column{flex-direction:column;height:100%;display:flex}.grid-outer-container{flex-direction:column;flex-grow:1;gap:1rem;height:100%;display:flex}.grid-controls{background:var(--bg-surface);border:1px solid var(--border-color);border-radius:8px;justify-content:space-between;align-items:center;padding:1rem;display:flex}.mode-toggle{border:1px solid var(--border-color);background:#131416;border-radius:4px;gap:.25rem;padding:.25rem;display:flex}.mode-btn{color:var(--color-text-secondary);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:.35rem .75rem;font-size:.8rem;font-weight:500;transition:all .15s}.mode-btn.active{color:#8ab4f8;background:#202124;box-shadow:0 1px 2px #0000004d}.grid-wrapper{background:var(--bg-surface);border:1px solid var(--border-color);border-radius:8px;flex-grow:1;justify-content:center;align-items:center;height:100%;padding:1.5rem;display:flex;position:relative;overflow:auto}.interactive-grid{background:var(--border-color);-webkit-user-select:none;user-select:none;border-radius:4px;gap:1px;padding:1px;display:grid}.grid-cell{width:76px;height:76px;color:var(--color-text-muted);background:#131416;border:none;justify-content:center;align-items:center;font-size:.8rem;transition:background .15s;display:flex;position:relative}.grid-cell:hover{background:#202124}.grid-cell.cell-occupied{z-index:2;border-style:solid!important;border-width:2px!important;border-radius:6px!important}.grid-cell.cell-occupied.connect-top{border-top-width:0!important;border-top-left-radius:0!important;border-top-right-radius:0!important}.grid-cell.cell-occupied.connect-bottom{border-bottom-width:0!important;border-bottom-right-radius:0!important;border-bottom-left-radius:0!important}.grid-cell.cell-occupied.connect-left{border-left-width:0!important;border-top-left-radius:0!important;border-bottom-left-radius:0!important}.grid-cell.cell-occupied.connect-right{border-right-width:0!important;border-top-right-radius:0!important;border-bottom-right-radius:0!important}.grid-cell.cell-occupied.rarity-commun,.grid-cell.preview-valid.rarity-commun{color:#e3e3e3!important;background:#303134!important;border-color:#3c4043!important}.grid-cell.cell-occupied.rarity-commun .char-token-symbol,.grid-cell.preview-valid.rarity-commun .char-token-symbol{color:#e3e3e3!important}.grid-cell.cell-occupied.rarity-commun .char-token-label,.grid-cell.preview-valid.rarity-commun .char-token-label{color:#9aa0a6!important}.grid-cell.cell-occupied.rarity-rare,.grid-cell.preview-valid.rarity-rare{color:#8ab4f8!important;background:#8ab4f81f!important;border-color:#8ab4f8!important}.grid-cell.cell-occupied.rarity-rare .char-token-symbol,.grid-cell.preview-valid.rarity-rare .char-token-symbol,.grid-cell.cell-occupied.rarity-rare .char-token-label,.grid-cell.preview-valid.rarity-rare .char-token-label{color:#8ab4f8!important}.grid-cell.cell-occupied.rarity-epique,.grid-cell.preview-valid.rarity-epique{color:#c573e8!important;background:#c573e81f!important;border-color:#c573e8!important}.grid-cell.cell-occupied.rarity-epique .char-token-symbol,.grid-cell.preview-valid.rarity-epique .char-token-symbol,.grid-cell.cell-occupied.rarity-epique .char-token-label,.grid-cell.preview-valid.rarity-epique .char-token-label{color:#c573e8!important}.grid-cell.cell-occupied.rarity-legendaire,.grid-cell.preview-valid.rarity-legendaire{color:#fdd663!important;background:#fdd6631f!important;border-color:#fdd663!important}.grid-cell.cell-occupied.rarity-legendaire .char-token-symbol,.grid-cell.preview-valid.rarity-legendaire .char-token-symbol,.grid-cell.cell-occupied.rarity-legendaire .char-token-label,.grid-cell.preview-valid.rarity-legendaire .char-token-label{color:#fdd663!important}.grid-cell.cell-occupied.rarity-mythique,.grid-cell.preview-valid.rarity-mythique{color:#ff80ab!important;background:linear-gradient(135deg,#ff80ab1f,#8ab4f81f,#c573e81f) 0 0/200% 200%!important;border-color:#ff80ab!important;animation:3s linear infinite rainbow-bg!important}.grid-cell.cell-occupied.rarity-mythique .char-token-symbol,.grid-cell.preview-valid.rarity-mythique .char-token-symbol,.grid-cell.cell-occupied.rarity-mythique .char-token-label,.grid-cell.preview-valid.rarity-mythique .char-token-label{color:#ff80ab!important}.grid-cell.cell-occupied.rarity-secret,.grid-cell.preview-valid.rarity-secret{color:#fff!important;background:#000!important;border-color:#3c4043!important}.grid-cell.cell-occupied.rarity-secret .char-token-symbol,.grid-cell.preview-valid.rarity-secret .char-token-symbol{color:#fff!important}.grid-cell.cell-occupied.rarity-secret .char-token-label,.grid-cell.preview-valid.rarity-secret .char-token-label{color:#9aa0a6!important}.grid-cell.cell-occupied.rarity-dieu,.grid-cell.preview-valid.rarity-dieu{color:#f28b82!important;background:#f28b821f!important;border-color:#f28b82!important}.grid-cell.cell-occupied.rarity-dieu .char-token-symbol,.grid-cell.preview-valid.rarity-dieu .char-token-symbol,.grid-cell.cell-occupied.rarity-dieu .char-token-label,.grid-cell.preview-valid.rarity-dieu .char-token-label{color:#f28b82!important}.grid-cell.cell-occupied.rarity-divin,.grid-cell.preview-valid.rarity-divin{color:#81c995!important;background:#81c9951f!important;border-color:#81c995!important}.grid-cell.cell-occupied.rarity-divin .char-token-symbol,.grid-cell.preview-valid.rarity-divin .char-token-symbol,.grid-cell.cell-occupied.rarity-divin .char-token-label,.grid-cell.preview-valid.rarity-divin .char-token-label{color:#81c995!important}.grid-cell.cell-occupied.rarity-limite,.grid-cell.preview-valid.rarity-limite{color:#78e9fa!important;background:#78e9fa1f!important;border-color:#78e9fa!important}.grid-cell.cell-occupied.rarity-limite .char-token-symbol,.grid-cell.preview-valid.rarity-limite .char-token-symbol,.grid-cell.cell-occupied.rarity-limite .char-token-label,.grid-cell.preview-valid.rarity-limite .char-token-label{color:#78e9fa!important}.legend-box{border:1px solid #ffffff26;border-radius:3px;width:12px;height:12px;display:inline-block}.grid-cell.cell-preview{opacity:.85;z-index:100!important}.grid-cell.cell-preview.preview-invalid{color:#f28b82!important;background:#f28b8226!important;border:2px dashed #f28b82!important}.grid-cell.cell-preview.preview-valid{border-style:dashed!important;border-width:2px!important}.item-color-indicator.rarity-commun{background:#5f6368}.item-color-indicator.rarity-rare{background:#8ab4f8}.item-color-indicator.rarity-epique{background:#c573e8}.item-color-indicator.rarity-legendaire{background:#fdd663}.item-color-indicator.rarity-mythique{background:linear-gradient(135deg,#ff80ab80,#8ab4f880,#c573e880) 0 0/200% 200%;animation:3s linear infinite rainbow-bg}.item-color-indicator.rarity-secret{background:#000;border:1px solid #3c4043}.item-color-indicator.rarity-dieu{background:#f28b82}.item-color-indicator.rarity-divin{background:#81c995}.item-color-indicator.rarity-limite{background:#78e9fa}@keyframes rainbow-bg{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}.char-token{cursor:grab;z-index:3;background:#131416bf;border:1px solid #ffffff1f;border-radius:6px;flex-direction:column;justify-content:center;align-items:center;transition:all .2s;display:flex;position:absolute;inset:4px;box-shadow:0 2px 4px #0006}.char-token:hover{border-color:var(--char-color,#ffffff4d);box-shadow:0 4px 10px var(--char-color-alpha-glow,#00000080);background:#131416e6;transform:scale(1.03)}.char-token.is-dragging{opacity:.4;cursor:grabbing;pointer-events:none!important}.char-token-symbol{font-family:var(--font-title);text-shadow:0 1px 2px #00000080;font-size:1.05rem;font-weight:700}.char-token-label{color:var(--color-text-primary);text-shadow:0 1px 1px #00000080;background:#00000080;border-radius:8px;margin-top:3px;padding:1px 6px;font-size:.7rem;font-weight:600;box-shadow:0 1px 2px #0000004d}.shape-drawer-grid{grid-template-columns:repeat(4,42px);justify-content:center;gap:6px;margin:.5rem 0;display:grid}.shape-drawer-cell{border:1px solid var(--border-color);cursor:pointer;background:#131416;border-radius:4px;width:42px;height:42px;transition:all .15s}.shape-drawer-cell:hover{background:#202124;border-color:#5f6368}.shape-drawer-cell.selected{background:#8ab4f8;border-color:#8ab4f8}.shape-drawer-cell.pivot{background:#81c995;border-color:#81c995;box-shadow:0 0 6px #81c99566}.preset-container{flex-wrap:wrap;gap:.5rem;margin-bottom:1rem;display:flex}.preset-btn{border:1px solid var(--border-color);color:var(--color-text-secondary);cursor:pointer;background:#202124;border-radius:4px;padding:.25rem .5rem;font-size:.75rem;transition:all .15s}.preset-btn:hover{color:var(--color-text-primary);background:#3c4043}.inventory-list{flex-direction:column;gap:.5rem;max-height:400px;padding-right:.25rem;display:flex;overflow-y:auto}.inventory-item{border:1px solid var(--border-color);background:#202124;border-radius:8px;justify-content:space-between;align-items:center;padding:.6rem .75rem;transition:background .15s;display:flex}.inventory-item:hover{background:#3c4043}.item-info{align-items:center;gap:.75rem;display:flex}.item-color-indicator{border-radius:50%;width:10px;height:10px}.item-name{font-size:.9rem;font-weight:500}.item-stats{color:var(--color-text-secondary);gap:.75rem;margin-top:.15rem;font-size:.75rem;display:flex}.uploader-stub{border:1px dashed var(--border-color);text-align:center;color:var(--color-text-secondary);cursor:pointer;background:#202124;border-radius:8px;flex-direction:column;align-items:center;gap:.5rem;padding:1.25rem;transition:border-color .15s;display:flex}.uploader-stub:hover{border-color:#8ab4f8}.uploader-stub-badge{text-transform:uppercase;color:#8ab4f8;background:#8ab4f81a;border:1px solid #8ab4f833;border-radius:4px;padding:.15rem .4rem;font-size:.65rem;font-weight:500}.drag-overlay-token{opacity:.8;cursor:grabbing;transform:scale(1.02);box-shadow:0 4px 12px #00000080;pointer-events:none!important}.front-line-cell{color:#f28b82;transition:background .15s;background:#f28b821a!important;border:1px dashed #f28b824d!important}.front-line-cell:hover{background:#f28b8233!important}.front-line-cell.cell-covered{background:#f28b8233!important;border:1px dashed #f28b82!important}.catalog-card{background:#1d1e20;border:1px solid #303134;border-radius:8px;flex-direction:column;gap:.4rem;padding:.5rem;transition:transform .2s,border-color .2s,box-shadow .2s;display:flex}.catalog-card:hover{border-color:var(--color-primary);transform:translateY(-1px);box-shadow:0 4px 10px #0000004d}.catalog-card-header{justify-content:space-between;align-items:center;gap:.5rem;display:flex}.catalog-card-title-group{align-items:center;gap:.5rem;min-width:0;display:flex}.catalog-card-title{color:var(--color-text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:.9rem;font-weight:600;overflow:hidden}.catalog-card-badge{text-transform:uppercase;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:4px;padding:.15rem .4rem;font-size:.65rem;font-weight:600}.catalog-card-stats{flex-wrap:wrap;gap:.5rem;display:flex}.catalog-stat-badge{color:var(--color-text-secondary);background:#ffffff08;border:1px solid #ffffff0d;border-radius:4px;align-items:center;gap:.3rem;padding:.25rem .5rem;font-size:.75rem;display:inline-flex}.catalog-card-actions{grid-template-columns:1fr 1fr;gap:.5rem;display:grid}.catalog-card-actions .btn{width:100%;padding:.4rem;font-size:.75rem}.placed-card{border:1px solid #303134;border-left:3px solid var(--char-color,var(--border-color));background:#1d1e20;border-radius:8px;flex-direction:column;gap:.75rem;padding:.85rem;transition:transform .2s,border-color .2s;display:flex}.placed-card:hover{border-color:var(--char-color,var(--border-color));transform:translateY(-1px)}.placed-card-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem;display:flex}.placed-card-title-group{flex-wrap:wrap;align-items:center;gap:.4rem;min-width:0;display:flex}.placed-card-title{color:var(--color-text-primary);font-size:.9rem;font-weight:600}.placed-card-badges{flex-wrap:wrap;gap:.3rem;display:flex}.placed-badge-trait{color:#8ab4f8;background:#8ab4f81a;border:1px solid #8ab4f840;border-radius:4px;padding:.1rem .35rem;font-size:.65rem;font-weight:600}.placed-badge-mutation{color:var(--color-warning);background:#fdd6631a;border:1px solid #fdd66340;border-radius:4px;padding:.1rem .35rem;font-size:.65rem;font-weight:600}.placed-card-stats{flex-wrap:wrap;gap:.4rem;display:flex}.placed-stat-badge{color:var(--color-text-secondary);background:#ffffff08;border:1px solid #ffffff0d;border-radius:4px;align-items:center;gap:.25rem;padding:.25rem .5rem;font-size:.7rem;display:inline-flex}.placed-stat-badge.dps{color:#81c995;background:#81c99514;border-color:#81c99533;font-weight:700}.placed-card-actions{grid-template-columns:1fr 1fr;gap:.5rem;display:grid}.placed-card-actions .btn{padding:.35rem;font-size:.7rem}